<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="content-type" content="text/html"; charset="UTF-8">
    <title>javascript完整表单验证</title>
    <script>
       
          /*function fun() {
              var obj=document.getElementById("uid");
              alert(obj.value);
          }*/
         /* function validate() {
              var uidObj=document.getElementById("uid");
              var passObj=document.getElementById("password");
              var emailObj=document.getElementById("email");
              if(uidObj.value.length==0)
                  alert("用户名不能为空！");
              if(!/^w+$/.test(passObj.value))
                  alert("密码不正确");
              if(!/^\w+@\w+\.\w+$/.test(emailObj.value))
                  alert("邮箱不正确！");
          }*/
        function validate()
        {
            return validateUid()&&validatePass()&&validateEmail();
        }
         function validateUid() {
             var uidObj=document.getElementById("uid");
             var uidMsg=document.getElementById("uidMsg");
             if(uidObj.value.length>0)
             {
                 uidMsg.innerHTML="<font color='green'>用户名正确!</font>";
                 return true;
             }
             else
             {
                 uidMsg.innerHTML="<font color='red'>用户名错误!</font>";
                 return false;
             }
         }
         function validatePass() {
             var passObj=document.getElementById("password");
             var passMsg=document.getElementById("passMsg");
             if(/^w+$/.test(passObj.value))
             {
                 passMsg.innerHTML="<font color='green'>密码正确!</font>";
                 return true;
             }
             else {
                 passMsg.innerHTML = "<font color='red'>密码错误!</font>";
                 return false;
             }
         }
         function validateEmail() {
             var emailObj=document.getElementById("email");
             var emailMsg=document.getElementById("emailMsg");
             if(/^\w+@\w+\.\w+$/.test(emailObj.value))
             {
                 emailMsg.innerHTML="<font color='green'>邮箱正确!</font>";
                 return true;
             }
             else
             {
                 emailMsg.innerHTML="<font color='red'>邮箱错误!</font>";
                 return false;
             }
         }
       
    </script>
</head>
<body>
  <form action="welcome.htm" name="post" onsubmit="return validate()"><br>
      用户名:<input type="text" name="uid" id="uid" onblur="validateUid()"><span id="uidMsg">*</span><br>
      密码:<input type="password" name="myPassword" id="password" onblur="validatePass()"><span id="passMsg">*</span><br>
      电子邮箱:<input type="email" name="myEmail" id="email" onblur="validateEmail()"><span id="emailMsg"></span><br>
      <input type="submit" value="提交" >&nbsp;
      <input type="reset" value="重置">
      <!--<input type="button" value="取得数据" onclick="fun()">;-->
  </form>
</body>
</html>
